<template>
    <div class="sys-user-reg-way-edit-modal relative" ref="editAddModal" >
        <a-modal 
                v-model:open="state.isShow"
                width="700px"
                wrapClassName="custom-modal"
                :bodyStyle="{height:'400px',overflowY:'overlay',overflowX:'hidden',paddingRight:'6px'}"
                :title="state.formState.id != undefined && state.formState.id > 0? '编辑注册方案':'添加注册方案'" 
                cancelText="取消"
                okText="确定"
                :getContainer="() => $refs.editAddModal"
                @ok="handleOk"
                @cancel="handleCancel"
        >
            <a-form
                ref="formRef"
                :model="state.formState"
                name="role-edit-form"
                autocomplete="off"
                :label-col="{ span: 3 }"
                :wrapper-col="{ span: 21 }"
            >
                <a-row >
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="方案名称"
                            name="name"
                            :rules="[{ required: true, message: '方案名称不能为空', trigger: 'blur' }]"
                        >
                            <a-input v-model:value="state.formState.name" />
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="账户类型"
                            name="accountType"
                            :rules="[{ required: true, message: '账户类型不能为空', trigger: 'blur' }]"
                        >
                            <a-select v-model:value="state.formState.accountType" placeholder="">
                                <template v-for="item in useMapDictList('AccountTypeEnum').filter((i:any)=>!['SuperAdmin','SysAdmin'].includes(i.code))" :key="item.value">
                                    <a-select-option :value="item.value">{{ item.label }}</a-select-option>
                                </template>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="绑定角色"
                            name="roleId"
                            :rules="[{ required: true, message: '角色不能为空', trigger: 'blur' }]"
                        >
                            <a-select v-model:value="state.formState.roleId" placeholder="">
                                <a-select-option v-for="item in state.roleData" :value="item.id">{{ item.name }}</a-select-option>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="绑定机构"
                            name="orgId"
                            :rules="[{ required: true, message: '机构不能为空', trigger: 'blur' }]"
                        >
                            <a-cascader
                                v-model:value="state.formState.orgId"
                                :options="state.orgData"
                                placeholder=""  
                                :field-names="{ label: 'name', value: 'id', children: 'children' }"
                                :changeOnSelect="true"
                            />
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="绑定职位"
                            name="posId"
                            :rules="[{ required: true, message: '职位不能为空', trigger: 'blur' }]"
                        >
                            <a-select v-model:value="state.formState.posId" placeholder="">
                                <a-select-option v-for="item in state.posData" :value="item.id">{{ item.name }}</a-select-option>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="排序"
                            name="orderNo"
                        >
                            <a-input-number class="w-full" v-model:value="state.formState.orderNo" placeholder="排序"/>
                        </a-form-item>
                    </a-col>
                    <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                        <a-form-item
                            label="备注"
                            name="remark"
                        >
                            <a-textarea :rows="2" v-model:value="state.formState.remark"/>
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
        </a-modal>
    </div>
</template>

<script setup lang="ts">
import { onMounted, reactive,ref } from 'vue';
import type { FormInstance } from 'ant-design-vue';
import { useMapDictList } from '@/hooks';
import { apiSysPosListGet } from '@/api/sys/sysPos';
import type { ResType } from '@/api/types';
import { apiSysRoleListGet } from '@/api/sys/sysRole';
import { apiSysOrgListGet } from '@/api/sys/sysOrg';
import { findParentPath, showMsg } from '@/utils';
import { cloneDeep } from 'lodash';
import { apiSysUserRegWayAddPost, apiSysUserRegWayUpdatePost } from '@/api/sys/SysUserRegWay';

const emits = defineEmits<{
    (e:"handleQuery"):void
}>()

const formRef = ref<FormInstance>()

const state = reactive({
    isShow:false,
    formState:{} as any,
    posData:[]as any[],
    roleData:[]as any[],
    orgData:[]as any[],
    loading:true,
    submitData:{} as any,
}) 

const handleOk = async ()=>{
    await formRef.value?.validate()
    state.submitData = cloneDeep(state.formState)

    if (Array.isArray(state.submitData.orgId) && state.submitData.orgId.length > 0) {
        state.submitData.orgId = state.submitData.orgId[state.submitData.orgId.length - 1]
    }

    if(state.submitData.id != undefined && state.submitData.id > 0){
        await apiSysUserRegWayUpdatePost(state.submitData)
    }else{
        await apiSysUserRegWayAddPost(state.submitData)
    }
    showMsg("操作成功",'success')
    emits('handleQuery')
    handleCancel()
}

const handleCancel = ()=>{
    state.isShow = false
    state.formState = {}
}

const handleOpen = (row:any)=>{
    state.isShow = true
    state.formState = JSON.parse(JSON.stringify(row))
    state.formState.orgId = findParentPath(state.orgData,row.orgId)
}


onMounted(async()=>{
    state.loading = true
    let res = await apiSysPosListGet() as ResType<any[]>
    state.posData = res.data.result
    res = await apiSysRoleListGet() as ResType<any[]>
    state.roleData = res.data.result
    res = await apiSysOrgListGet(0) as ResType<any[]>
    state.orgData = res.data.result
    state.loading =false
})

defineExpose({
    handleOpen,
})
</script>

<style lang="scss" scoped>
    
</style>